fix(web): fix reload lynx-view when false may cause css style lost#1982
fix(web): fix reload lynx-view when false may cause css style lost#1982Sherry-hue merged 1 commit intolynx-family:mainfrom
Conversation
🦋 Changeset detectedLatest commit: 8ce185f The changes in this PR will be included in the next version bump. This PR includes changesets to release 10 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
📝 WalkthroughWalkthroughThreaded a new allOnUI flag through style-processing and main-thread API bootstrap, added an option to deep-clone style structures in style flattening, updated call sites to pass the flag, and added a test + assets reproducing a reload-related CSS loss when enableCSSSelector is false. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes
Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Codecov Report✅ All modified and coverable lines are covered by tests. 📢 Thoughts on this report? Let us know! |
CodSpeed Performance ReportMerging #1982 will not alter performanceComparing Summary
Footnotes
|
React Example#6403 Bundle Size — 236.9KiB (0%).8ce185f(current) vs 553ece1 main#6402(baseline) Bundle metrics
|
| Current #6403 |
Baseline #6402 |
|
|---|---|---|
0B |
0B |
|
0B |
0B |
|
0% |
0% |
|
0 |
0 |
|
4 |
4 |
|
162 |
162 |
|
65 |
65 |
|
46.74% |
46.74% |
|
2 |
2 |
|
0 |
0 |
Bundle size by type no changes
| Current #6403 |
Baseline #6402 |
|
|---|---|---|
145.76KiB |
145.76KiB |
|
91.14KiB |
91.14KiB |
Bundle analysis report Branch Sherry-hue:fix/reload-css-lost Project dashboard
Generated by RelativeCI Documentation Report issue
Web Explorer#6563 Bundle Size — 372.9KiB (+0.05%).8ce185f(current) vs 553ece1 main#6562(baseline) Bundle metrics
Bundle size by type
Bundle analysis report Branch Sherry-hue:fix/reload-css-lost Project dashboard Generated by RelativeCI Documentation Report issue |
d6bb3ff to
87892aa
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.ts (1)
40-58: Threading allOnUI through prepareMainThreadAPIs to style handling is soundAdding
allOnUI?: booleanat the end of the parameter list and forwarding it intoappendStyleElementcleanly scopes the new behavior to the styling pipeline while keeping the API backward‑compatible for existing call sites. This aligns with the earlier design where style processing is centralized inprocessStyleInfo/appendStyleElement. Based on learnings, this is consistent with how style handling has been extended in prior PRs.If we expect more flags like this in future, it might be worth gradually moving these trailing positional parameters (
ssrHooks,allOnUI, etc.) into a single options object to improve readability and reduce call‑site churn, but that can be deferred.Please confirm that
appendStyleElementtreatsallOnUIbeingfalsevsundefinedidentically for non‑all‑on‑UI paths so that existing behavior is unchanged when callers omit the new flag.Also applies to: 108-115
packages/web-platform/web-core-server/src/createLynxView.ts (1)
58-59: Server-side allOnUI wiring matches current threadStrategy usage, but consider future-proofingDeriving the new
allOnUIflag viathreadStrategy === 'all-on-ui'and passing it as the final argument toprepareMainThreadAPIsis consistent with this server helper only supporting the'all-on-ui'strategy today; it keeps SSR style handling on the all‑on‑UI path as intended.Given that the runtime
LynxView.threadStrategyAPI on the client side already supports'all-on-ui' | 'multi-thread', you might eventually wantLynxViewConfig.threadStrategyhere to mirror that union and let the boolean discriminate between the two strategies on the server as well. Not required for this PR, but it would avoid surprises if multi‑thread SSR is added later.If you plan to support server‑side
'multi-thread'in the future, please confirm whethercreateLynxViewshould reject that configuration explicitly now (e.g., via a runtime check) or keep silently treating everything as all‑on‑UI.Also applies to: 169-209
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
.changeset/nasty-pens-love.md(1 hunks)packages/web-platform/web-core-server/src/createLynxView.ts(1 hunks)packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts(1 hunks)packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.ts(2 hunks)packages/web-platform/web-mainthread-apis/ts/utils/processStyleInfo.ts(5 hunks)packages/web-platform/web-tests/tests/react.spec.ts(1 hunks)packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.css(1 hunks)packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx(1 hunks)packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (4)
- .changeset/nasty-pens-love.md
- packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.css
- packages/web-platform/web-tests/tests/react.spec.ts
- packages/web-platform/web-mainthread-apis/ts/utils/processStyleInfo.ts
🧰 Additional context used
🧠 Learnings (14)
📓 Common learnings
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.
📚 Learning: 2025-10-10T08:22:12.051Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-mainthread-apis/src/prepareMainThreadAPIs.ts:266-266
Timestamp: 2025-10-10T08:22:12.051Z
Learning: In packages/web-platform/web-mainthread-apis, the handleUpdatedData function returned from prepareMainThreadAPIs is internal-only, used to serve web-core. It does not require public documentation, type exports, or SSR support.
Applied to files:
packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.tspackages/web-platform/web-core/src/uiThread/createRenderAllOnUI.tspackages/web-platform/web-worker-runtime/src/mainThread/startMainThread.tspackages/web-platform/web-core-server/src/createLynxView.ts
📚 Learning: 2025-09-18T08:12:56.802Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.
Applied to files:
packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.tspackages/web-platform/web-core/src/uiThread/createRenderAllOnUI.tspackages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: NativeTTObject)
Applied to files:
packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.tspackages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: any)
Applied to files:
packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.tspackages/web-platform/web-core-server/src/createLynxView.ts
📚 Learning: 2025-09-28T08:46:43.177Z
Learnt from: f0rdream
Repo: lynx-family/lynx-stack PR: 1835
File: packages/react/worklet-runtime/src/workletRuntime.ts:52-55
Timestamp: 2025-09-28T08:46:43.177Z
Learning: The legacy worklet path with `_lepusWorkletHash` in `packages/react/worklet-runtime/src/workletRuntime.ts` is preserved for compatibility with MTS (Mini-app Threading Service) that doesn't support Initial Frame Rendering. This path will not be touched in current implementations.
Applied to files:
packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts
📚 Learning: 2025-08-06T13:28:57.182Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1453
File: vitest.config.ts:49-61
Timestamp: 2025-08-06T13:28:57.182Z
Learning: In the lynx-family/lynx-stack repository, the file `packages/react/testing-library/src/vitest.config.js` is source code for the testing library that gets exported for users, not a test configuration that should be included in the main vitest projects array.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-08-06T13:28:57.182Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1453
File: vitest.config.ts:49-61
Timestamp: 2025-08-06T13:28:57.182Z
Learning: In the lynx-family/lynx-stack repository, the file `packages/rspeedy/create-rspeedy/template-react-vitest-rltl-js/vitest.config.js` is a template file for scaffolding new Rspeedy projects, not a test configuration that should be included in the main vitest projects array.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-11-11T08:05:14.163Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1932
File: packages/web-platform/web-tests/tests/react/basic-element-x-input-ng-bindinput/index.jsx:10-26
Timestamp: 2025-11-11T08:05:14.163Z
Learning: In packages/web-platform/web-tests/tests/react/basic-element-x-input-ng-bindinput/index.jsx, the test intentionally uses selectionStart twice in the result string (instead of selectionStart and selectionEnd) because it prioritizes testing whether x-input-ng works functionally, rather than validating the correctness of selection values.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-09-23T08:54:39.966Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1670
File: packages/webpack/css-extract-webpack-plugin/test/hotCases/hot/hot-update-json/dual-thread/__snapshot__/index.css:6-8
Timestamp: 2025-09-23T08:54:39.966Z
Learning: In the lynx-stack CSS extract webpack plugin tests, many test fixture CSS files intentionally use invalid CSS syntax like `color: 'red';` with quoted values. The snapshots correctly reflect this invalid CSS from the source fixtures. To fix CSS validation issues, the source fixture files should be updated first, then snapshots regenerated, rather than manually editing snapshots.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-10-11T06:16:12.517Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1820
File: packages/web-platform/web-tests/tests/react.spec.ts:834-856
Timestamp: 2025-10-11T06:16:12.517Z
Learning: In packages/web-platform/web-tests/tests/react.spec.ts, the tests `basic-bindmouse` and `basic-mts-bindtouchstart` are NOT duplicates despite having similar test structures. They test different event types: `basic-bindmouse` validates mouse events (mousedown, mouseup, mousemove) with mouse-specific properties (button, buttons, x, y, pageX, pageY, clientX, clientY), while `basic-mts-bindtouchstart` validates touch events (touchstart) with touch arrays (touches, targetTouches, changedTouches). The similar test structure is coincidental and follows testing conventions.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-10-29T10:28:27.519Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1899
File: packages/react/transform/crates/swc_plugin_snapshot/tests/__swc_snapshots__/lib.rs/should_static_extract_dynamic_inline_style.js:20-24
Timestamp: 2025-10-29T10:28:27.519Z
Learning: Files inside packages/react/transform/crates/swc_plugin_snapshot/tests/__swc_snapshots__/ are auto-generated test snapshot files and should not be manually updated. Any issues with the generated code should be addressed in the code generator/transform logic, not in the snapshots themselves.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-08-11T05:57:18.212Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1305
File: packages/testing-library/testing-environment/src/index.ts:255-258
Timestamp: 2025-08-11T05:57:18.212Z
Learning: In the ReactLynx testing environment (`packages/testing-library/testing-environment/src/index.ts`), the dual assignment pattern `target.console.method = console.method = () => {}` is required for rstest compatibility. This is because rstest provides `console` in an IIFE (Immediately Invoked Function Expression), and both the target and global console need to have these methods defined for proper test execution.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-08-12T16:09:32.413Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1497
File: packages/react/transform/tests/__swc_snapshots__/src/swc_plugin_snapshot/mod.rs/basic_full_static.js:9-10
Timestamp: 2025-08-12T16:09:32.413Z
Learning: In the Lynx stack, functions prefixed with `__` that are called in transformed code may be injected globally by the Lynx Engine at runtime rather than exported from the React runtime package. For example, `__CreateFrame` is injected globally by the Lynx Engine, not exported from lynx-js/react.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
🧬 Code graph analysis (1)
packages/web-platform/web-core-server/src/createLynxView.ts (1)
packages/web-platform/web-core/src/apis/LynxView.ts (2)
threadStrategy(348-351)threadStrategy(352-358)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: build / Build (Ubuntu)
- GitHub Check: build / Build (Windows)
- GitHub Check: test-rust / Test (Ubuntu)
🔇 Additional comments (3)
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx (1)
1-15: Test fixture JSX looks correct for the new CSS reload scenarioStructure and usage of
Appandroot.renderare consistent with other Lynx React tests; theid="target"andclass="parent"hook up cleanly to the new CSS asset. No changes requested.packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts (1)
94-118: prepareMainThreadAPIs: explicit allOnUI=false for multi‑thread pathPassing
undefinedforssrHookspreserves prior behavior, and explicitly wiringfalsefor the newallOnUIflag clearly marks this as the non‑all‑on‑UI path. This matches the intended separation from the new all‑on‑UI flows.Please re‑run the existing multi‑thread web‑worker tests to confirm there’s no regression in style handling when
allOnUIis false.packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts (1)
130-149: All‑on‑UI path correctly flags allOnUI=trueThe updated call to
prepareMainThreadAPIswithundefinedforssrHooksandtrueforallOnUIcleanly marks this iframe/All‑On‑UI execution path and matches the new API contract without altering existing control flow.Please ensure the new
config-css-selector-false-reloadtest exercises this all‑on‑UI path so we catch any future regressions in style handling specific toallOnUI === true.
87892aa to
8ce185f
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts (1)
147-148: The parameters passed toprepareMainThreadAPIsare appropriate for internal API usage.The additional arguments
undefined, trueenable all-on-UI mode styling. SinceprepareMainThreadAPIsis internal-only API serving web-core, public documentation is not required. However, the magic booleantruecould benefit from a named constant (e.g.,const ALL_ON_UI = true) to improve code clarity and maintainability.
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (9)
.changeset/nasty-pens-love.md(1 hunks)packages/web-platform/web-core-server/src/createLynxView.ts(1 hunks)packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts(1 hunks)packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.ts(2 hunks)packages/web-platform/web-mainthread-apis/ts/utils/processStyleInfo.ts(5 hunks)packages/web-platform/web-tests/tests/react.spec.ts(1 hunks)packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.css(1 hunks)packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx(1 hunks)packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (5)
- packages/web-platform/web-mainthread-apis/ts/utils/processStyleInfo.ts
- packages/web-platform/web-tests/tests/react.spec.ts
- packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.css
- packages/web-platform/web-core-server/src/createLynxView.ts
- packages/web-platform/web-mainthread-apis/ts/prepareMainThreadAPIs.ts
🧰 Additional context used
📓 Path-based instructions (1)
.changeset/*.md
📄 CodeRabbit inference engine (AGENTS.md)
For contributions, generate and commit a Changeset describing your changes
Files:
.changeset/nasty-pens-love.md
🧠 Learnings (19)
📓 Common learnings
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.
📚 Learning: 2025-10-10T08:22:12.051Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-mainthread-apis/src/prepareMainThreadAPIs.ts:266-266
Timestamp: 2025-10-10T08:22:12.051Z
Learning: In packages/web-platform/web-mainthread-apis, the handleUpdatedData function returned from prepareMainThreadAPIs is internal-only, used to serve web-core. It does not require public documentation, type exports, or SSR support.
Applied to files:
packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.tspackages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: NativeTTObject)
Applied to files:
packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts
📚 Learning: 2025-09-28T07:52:03.601Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1837
File: packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/createNativeApp.ts:151-154
Timestamp: 2025-09-28T07:52:03.601Z
Learning: There are two different registerUpdateDataHandler functions in the lynx-stack codebase:
1. Main thread version in packages/web-platform/web-worker-runtime/src/mainThread/crossThreadHandlers/registerUpdateDataHandler.ts takes (mainThreadRpc: Rpc, backgroundThreadRpc: Rpc, runtime: MainThreadGlobalThis)
2. Background thread version in packages/web-platform/web-worker-runtime/src/backgroundThread/background-apis/crossThreadHandlers/registerUpdateDataHandler.ts takes only (rpc: Rpc, tt: any)
Applied to files:
packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts
📚 Learning: 2025-08-06T13:28:57.182Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1453
File: vitest.config.ts:49-61
Timestamp: 2025-08-06T13:28:57.182Z
Learning: In the lynx-family/lynx-stack repository, the file `packages/react/testing-library/src/vitest.config.js` is source code for the testing library that gets exported for users, not a test configuration that should be included in the main vitest projects array.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-08-06T13:28:57.182Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1453
File: vitest.config.ts:49-61
Timestamp: 2025-08-06T13:28:57.182Z
Learning: In the lynx-family/lynx-stack repository, the file `packages/rspeedy/create-rspeedy/template-react-vitest-rltl-js/vitest.config.js` is a template file for scaffolding new Rspeedy projects, not a test configuration that should be included in the main vitest projects array.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-11-11T08:05:14.163Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1932
File: packages/web-platform/web-tests/tests/react/basic-element-x-input-ng-bindinput/index.jsx:10-26
Timestamp: 2025-11-11T08:05:14.163Z
Learning: In packages/web-platform/web-tests/tests/react/basic-element-x-input-ng-bindinput/index.jsx, the test intentionally uses selectionStart twice in the result string (instead of selectionStart and selectionEnd) because it prioritizes testing whether x-input-ng works functionally, rather than validating the correctness of selection values.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-10-11T06:16:12.517Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1820
File: packages/web-platform/web-tests/tests/react.spec.ts:834-856
Timestamp: 2025-10-11T06:16:12.517Z
Learning: In packages/web-platform/web-tests/tests/react.spec.ts, the tests `basic-bindmouse` and `basic-mts-bindtouchstart` are NOT duplicates despite having similar test structures. They test different event types: `basic-bindmouse` validates mouse events (mousedown, mouseup, mousemove) with mouse-specific properties (button, buttons, x, y, pageX, pageY, clientX, clientY), while `basic-mts-bindtouchstart` validates touch events (touchstart) with touch arrays (touches, targetTouches, changedTouches). The similar test structure is coincidental and follows testing conventions.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-09-23T08:54:39.966Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1670
File: packages/webpack/css-extract-webpack-plugin/test/hotCases/hot/hot-update-json/dual-thread/__snapshot__/index.css:6-8
Timestamp: 2025-09-23T08:54:39.966Z
Learning: In the lynx-stack CSS extract webpack plugin tests, many test fixture CSS files intentionally use invalid CSS syntax like `color: 'red';` with quoted values. The snapshots correctly reflect this invalid CSS from the source fixtures. To fix CSS validation issues, the source fixture files should be updated first, then snapshots regenerated, rather than manually editing snapshots.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx.changeset/nasty-pens-love.md
📚 Learning: 2025-08-11T05:57:18.212Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1305
File: packages/testing-library/testing-environment/src/index.ts:255-258
Timestamp: 2025-08-11T05:57:18.212Z
Learning: In the ReactLynx testing environment (`packages/testing-library/testing-environment/src/index.ts`), the dual assignment pattern `target.console.method = console.method = () => {}` is required for rstest compatibility. This is because rstest provides `console` in an IIFE (Immediately Invoked Function Expression), and both the target and global console need to have these methods defined for proper test execution.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-10-29T10:28:27.519Z
Learnt from: upupming
Repo: lynx-family/lynx-stack PR: 1899
File: packages/react/transform/crates/swc_plugin_snapshot/tests/__swc_snapshots__/lib.rs/should_static_extract_dynamic_inline_style.js:20-24
Timestamp: 2025-10-29T10:28:27.519Z
Learning: Files inside packages/react/transform/crates/swc_plugin_snapshot/tests/__swc_snapshots__/ are auto-generated test snapshot files and should not be manually updated. Any issues with the generated code should be addressed in the code generator/transform logic, not in the snapshots themselves.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-08-12T16:09:32.413Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1497
File: packages/react/transform/tests/__swc_snapshots__/src/swc_plugin_snapshot/mod.rs/basic_full_static.js:9-10
Timestamp: 2025-08-12T16:09:32.413Z
Learning: In the Lynx stack, functions prefixed with `__` that are called in transformed code may be injected globally by the Lynx Engine at runtime rather than exported from the React runtime package. For example, `__CreateFrame` is injected globally by the Lynx Engine, not exported from lynx-js/react.
Applied to files:
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx
📚 Learning: 2025-09-18T08:12:56.802Z
Learnt from: Sherry-hue
Repo: lynx-family/lynx-stack PR: 1770
File: packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts:316-318
Timestamp: 2025-09-18T08:12:56.802Z
Learning: In packages/web-platform/web-mainthread-apis/src/utils/processStyleInfo.ts, the current implementation uses cardStyleElement.textContent += for lazy component styles. While this could theoretically invalidate rule indices by reparsing the stylesheet, Sherry-hue indicated that UIDs don't repeat for the same element, making this approach acceptable for now. A future optimization to use separate style elements per entry was discussed but deferred to a separate PR to keep the current lazy bundle PR focused.
Applied to files:
packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, empty changeset files (containing only `---\n\n---`) are used for internal changes that modify src/** files but don't require meaningful release notes, such as private package changes or testing-only modifications. This satisfies CI requirements without generating user-facing release notes.
Applied to files:
.changeset/nasty-pens-love.md
📚 Learning: 2025-07-22T09:23:07.797Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:23:07.797Z
Learning: In the lynx-family/lynx-stack repository, changesets are only required for meaningful changes to end-users such as bugfixes and features. Internal/development changes like chores, refactoring, or removing debug info do not need changeset entries.
Applied to files:
.changeset/nasty-pens-love.md
📚 Learning: 2025-09-12T09:43:04.847Z
Learnt from: gaoachao
Repo: lynx-family/lynx-stack PR: 1736
File: .changeset/spotty-experts-smoke.md:1-3
Timestamp: 2025-09-12T09:43:04.847Z
Learning: In the lynx-family/lynx-stack repository, private packages (marked with "private": true in package.json) like lynx-js/react-transform don't require meaningful changeset entries even when their public APIs change, since they are not published externally and only affect internal development.
Applied to files:
.changeset/nasty-pens-love.md
📚 Learning: 2025-07-22T09:26:16.722Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1330
File: .changeset/olive-animals-attend.md:1-3
Timestamp: 2025-07-22T09:26:16.722Z
Learning: In the lynx-family/lynx-stack repository, CI checks require changesets when files matching the pattern "src/**" are modified (as configured in .changeset/config.json). For internal changes that don't need meaningful changesets, an empty changeset file is used to satisfy the CI requirement while not generating any release notes.
Applied to files:
.changeset/nasty-pens-love.md
📚 Learning: 2025-08-07T04:00:59.645Z
Learnt from: colinaaa
Repo: lynx-family/lynx-stack PR: 1454
File: pnpm-workspace.yaml:46-46
Timestamp: 2025-08-07T04:00:59.645Z
Learning: In the lynx-family/lynx-stack repository, the webpack patch (patches/webpack5.101.0.patch) was created to fix issues with webpack5.99.9 but only takes effect on webpack5.100.0 and later versions. The patchedDependencies entry should use "webpack@^5.100.0" to ensure the patch applies to the correct version range.
Applied to files:
.changeset/nasty-pens-love.md
📚 Learning: 2025-07-16T06:28:26.463Z
Learnt from: PupilTong
Repo: lynx-family/lynx-stack PR: 1029
File: packages/web-platform/web-core/src/uiThread/createRenderAllOnUI.ts:95-99
Timestamp: 2025-07-16T06:28:26.463Z
Learning: In the lynx-stack codebase, CSS selectors in SSR hydration are generated by their own packages, ensuring a predictable format that makes simple string manipulation safe and preferable over regex for performance reasons.
Applied to files:
.changeset/nasty-pens-love.md
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)
- GitHub Check: build / Build (Windows)
- GitHub Check: build / Build (Ubuntu)
- GitHub Check: test-rust / clippy
- GitHub Check: test-rust / Test (Ubuntu)
🔇 Additional comments (3)
.changeset/nasty-pens-love.md (1)
1-5: LGTM!The changeset correctly documents this bugfix with an appropriate patch-level bump for
@lynx-js/web-mainthread-apis. The description clearly identifies the issue being resolved.packages/web-platform/web-worker-runtime/src/mainThread/startMainThread.ts (1)
116-117: LGTM! Consider named constants for clarity.The additional arguments
undefined, falsecorrectly indicate this is NOT all-on-UI mode (worker-based threading). Thefalsevalue is appropriate for this context and consistent with the pattern used increateRenderAllOnUI.ts.Similar to the other call site, consider using named constants instead of bare boolean literals for better readability.
packages/web-platform/web-tests/tests/react/config-css-selector-false-reload/index.jsx (1)
1-15: Test fixture for CSS reload scenario when enableCSSSelector is falseThis test fixture creates a minimal React component to reproduce the CSS style loss issue on reload. The component structure is appropriate: it imports the test styles via
./index.cssand renders a view element with id and class attributes for verification.Verify that the corresponding test case in
react.spec.tsproperly validates that styles persist after reload whenenableCSSSelectoris false, and confirm the test assertions match this fixture's structure.
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @lynx-js/css-extract-webpack-plugin@0.7.0 ### Minor Changes - **BREAKING CHANGE**: Require `@lynx-js/template-webpack-plugin` 0.10.0. ([#1965](#1965)) - Merge all css chunk and generate a `.css.hot-update.json` file for each bundle. ([#1965](#1965)) ## @lynx-js/template-webpack-plugin@0.10.0 ### Minor Changes - Merge all css chunk and generate a `.css.hot-update.json` file for each bundle. ([#1965](#1965)) ## @lynx-js/react@0.115.1 ### Patch Changes - Auto define lynx.loadLazyBundle when using `import(/* relative path */)`. ([#1956](#1956)) - feat: support declaring cross-thread shared modules via Import Attributes, enabling Main Thread Functions to call standard JS functions directly. ([#1968](#1968)) - Usage: Add `with { runtime: "shared" }` to the `import` statement. For example: ```ts import { func } from './utils.js' with { runtime: 'shared' }; function worklet() { 'main thread'; func(); // callable inside a main thread function } ``` - Limitations: - Only directly imported identifiers are treated as shared; assigning the import to a new variable will result in the loss of this shared capability. - Functions defined within shared modules do not automatically become Main Thread Functions. Accessing main-thread-only APIs (e.g., `MainThreadRef`) will cause errors. ## @lynx-js/rspeedy@0.12.2 ### Patch Changes - Bump Rsbuild v1.6.13 with Rspack v1.6.6. ([#1995](#1995)) - Updated dependencies \[]: - @lynx-js/web-rsbuild-server-middleware@0.19.1 ## @lynx-js/react-rsbuild-plugin@0.12.1 ### Patch Changes - Avoid injecting hot update runtime when dev.hmr or dev.liveReload is set to false. ([#1980](#1980)) - Updated dependencies \[[`553ece1`](553ece1), [`8cdb69d`](8cdb69d), [`8cdb69d`](8cdb69d)]: - @lynx-js/react-webpack-plugin@0.7.3 - @lynx-js/css-extract-webpack-plugin@0.7.0 - @lynx-js/template-webpack-plugin@0.10.0 - @lynx-js/react-alias-rsbuild-plugin@0.12.1 - @lynx-js/use-sync-external-store@1.5.0 - @lynx-js/react-refresh-webpack-plugin@0.3.4 ## @lynx-js/web-constants@0.19.1 ### Patch Changes - Updated dependencies \[]: - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/web-core@0.19.1 ### Patch Changes - fix: support CSP for mts ([#1994](#1994)) - Updated dependencies \[[`f7256d5`](f7256d5)]: - @lynx-js/web-mainthread-apis@0.19.1 - @lynx-js/web-worker-runtime@0.19.1 - @lynx-js/web-constants@0.19.1 - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/web-mainthread-apis@0.19.1 ### Patch Changes - fix: fix reload lynx-view when `enableCSSSelector` false may cause css style lost ([#1982](#1982)) - Updated dependencies \[]: - @lynx-js/web-constants@0.19.1 ## @lynx-js/web-worker-runtime@0.19.1 ### Patch Changes - Updated dependencies \[[`f7256d5`](f7256d5)]: - @lynx-js/web-mainthread-apis@0.19.1 - @lynx-js/web-constants@0.19.1 - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/react-webpack-plugin@0.7.3 ### Patch Changes - Support `@lynx-js/template-webpack-plugin` v0.10.0. ([#1992](#1992)) ## create-rspeedy@0.12.2 ## @lynx-js/react-alias-rsbuild-plugin@0.12.1 ## upgrade-rspeedy@0.12.2 ## @lynx-js/web-core-server@0.19.1 ## @lynx-js/web-rsbuild-server-middleware@0.19.1 ## @lynx-js/web-worker-rpc@0.19.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
…ynx-family#1982) <!-- Thank you for submitting a pull request! We appreciate the time and effort you have invested in making these changes. Please ensure that you provide enough information to allow others to review your pull request. Upon submission, your pull request will be automatically assigned with reviewers. If you want to learn more about contributing to this project, please visit: https://github.com/lynx-family/lynx-stack/blob/main/CONTRIBUTING.md. --> <!-- The AI summary below will be auto-generated - feel free to replace it with your own. --> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Bug Fixes** * Fixed an issue where CSS styles could be lost when reloading a lynx-view with CSS selector handling disabled, preserving styles across reloads. * **Tests** * Added an end-to-end test page, stylesheet, and test case to verify styling remains unchanged after reloading the lynx-view when CSS selector configuration is disabled. <sub>✏️ Tip: You can customize this high-level summary in your review settings.</sub> <!-- end of auto-generated comment: release notes by coderabbit.ai --> ## Checklist <!--- Check and mark with an "x" --> - [ ] Tests updated (or not required). - [ ] Documentation updated (or not required). - [ ] Changeset added, and when a BREAKING CHANGE occurs, it needs to be clearly marked (or not required).
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @lynx-js/css-extract-webpack-plugin@0.7.0 ### Minor Changes - **BREAKING CHANGE**: Require `@lynx-js/template-webpack-plugin` 0.10.0. ([lynx-family#1965](lynx-family#1965)) - Merge all css chunk and generate a `.css.hot-update.json` file for each bundle. ([lynx-family#1965](lynx-family#1965)) ## @lynx-js/template-webpack-plugin@0.10.0 ### Minor Changes - Merge all css chunk and generate a `.css.hot-update.json` file for each bundle. ([lynx-family#1965](lynx-family#1965)) ## @lynx-js/react@0.115.1 ### Patch Changes - Auto define lynx.loadLazyBundle when using `import(/* relative path */)`. ([lynx-family#1956](lynx-family#1956)) - feat: support declaring cross-thread shared modules via Import Attributes, enabling Main Thread Functions to call standard JS functions directly. ([lynx-family#1968](lynx-family#1968)) - Usage: Add `with { runtime: "shared" }` to the `import` statement. For example: ```ts import { func } from './utils.js' with { runtime: 'shared' }; function worklet() { 'main thread'; func(); // callable inside a main thread function } ``` - Limitations: - Only directly imported identifiers are treated as shared; assigning the import to a new variable will result in the loss of this shared capability. - Functions defined within shared modules do not automatically become Main Thread Functions. Accessing main-thread-only APIs (e.g., `MainThreadRef`) will cause errors. ## @lynx-js/rspeedy@0.12.2 ### Patch Changes - Bump Rsbuild v1.6.13 with Rspack v1.6.6. ([lynx-family#1995](lynx-family#1995)) - Updated dependencies \[]: - @lynx-js/web-rsbuild-server-middleware@0.19.1 ## @lynx-js/react-rsbuild-plugin@0.12.1 ### Patch Changes - Avoid injecting hot update runtime when dev.hmr or dev.liveReload is set to false. ([lynx-family#1980](lynx-family#1980)) - Updated dependencies \[[`553ece1`](lynx-family@553ece1), [`8cdb69d`](lynx-family@8cdb69d), [`8cdb69d`](lynx-family@8cdb69d)]: - @lynx-js/react-webpack-plugin@0.7.3 - @lynx-js/css-extract-webpack-plugin@0.7.0 - @lynx-js/template-webpack-plugin@0.10.0 - @lynx-js/react-alias-rsbuild-plugin@0.12.1 - @lynx-js/use-sync-external-store@1.5.0 - @lynx-js/react-refresh-webpack-plugin@0.3.4 ## @lynx-js/web-constants@0.19.1 ### Patch Changes - Updated dependencies \[]: - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/web-core@0.19.1 ### Patch Changes - fix: support CSP for mts ([lynx-family#1994](lynx-family#1994)) - Updated dependencies \[[`f7256d5`](lynx-family@f7256d5)]: - @lynx-js/web-mainthread-apis@0.19.1 - @lynx-js/web-worker-runtime@0.19.1 - @lynx-js/web-constants@0.19.1 - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/web-mainthread-apis@0.19.1 ### Patch Changes - fix: fix reload lynx-view when `enableCSSSelector` false may cause css style lost ([lynx-family#1982](lynx-family#1982)) - Updated dependencies \[]: - @lynx-js/web-constants@0.19.1 ## @lynx-js/web-worker-runtime@0.19.1 ### Patch Changes - Updated dependencies \[[`f7256d5`](lynx-family@f7256d5)]: - @lynx-js/web-mainthread-apis@0.19.1 - @lynx-js/web-constants@0.19.1 - @lynx-js/web-worker-rpc@0.19.1 ## @lynx-js/react-webpack-plugin@0.7.3 ### Patch Changes - Support `@lynx-js/template-webpack-plugin` v0.10.0. ([lynx-family#1992](lynx-family#1992)) ## create-rspeedy@0.12.2 ## @lynx-js/react-alias-rsbuild-plugin@0.12.1 ## upgrade-rspeedy@0.12.2 ## @lynx-js/web-core-server@0.19.1 ## @lynx-js/web-rsbuild-server-middleware@0.19.1 ## @lynx-js/web-worker-rpc@0.19.1 Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Summary by CodeRabbit
Bug Fixes
Tests
✏️ Tip: You can customize this high-level summary in your review settings.
Checklist